<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" type="text/css" href="../static/plugins/jquery-easyui-1.5.5.4/themes/default/easyui.css">
	<link rel="stylesheet" type="text/css" href="../static/plugins/jquery-easyui-1.5.5.4/themes/icon.css">
	<link rel="stylesheet" type="text/css" href="../static/plugins/easyui/common/index.css">
	<link href="../static/plugins/easyui/jquery-easyui-theme/icon.css" rel="stylesheet" type="text/css" />
	<link href="../static/plugins/easyui/icons/icon-all.css" rel="stylesheet" type="text/css" />
	<link href="../static/plugins/easyui/common/other.css" rel="stylesheet" type="text/css" />
	<script src="../webjars/jquery/3.3.1/dist/jquery.js"></script>
	<script type="text/javascript" src="../static/plugins/jquery-easyui-1.5.5.4/jquery.easyui.min.js"></script>
	<!-- <script src="../static/plugins/easyui/jeasyui-extensions/jeasyui.extensions.js" type="text/javascript"></script>
	<script src="../static/plugins/easyui/jeasyui-extensions/jeasyui.extensions.window.js" type="text/javascript"></script>
	<script src="../static/plugins/easyui/jeasyui-extensions/jeasyui.extensions.dialog.js" type="text/javascript"></script> -->
	<script type="text/javascript" th:inline="javascript">
	var path = /*[[@{/databaseHandler/}]]*/;
	/*<![CDATA[*/
    var context = /*[[@{/}]]*/;
    /*]]>*/
	var contextpath="http://localhost:8888/databaseManage/";
	var connectionId;
	var databaseName;
	var tableName;
	
	$(function(){
		connectionId = $("#connectionId").val();
		databaseName = $("#databaseName").val();
		tableName = $("#tableName").val();		
		 $("#dg").datagrid({  
		        method: 'GET',  
		        nowrap: false,  
		        striped: true,  
		        fit:true,  
		        width:1024,  
		        height:500,  
		        url:path+"getDatabaseConfigList",  
		        pageSize:30,  
		        remoteSort: false,  
		        pagination:false,  
		        rownumbers:true,  
		        singleSelect:true,
		        toolbar:'#tb2',
		        queryParams:{  
		        	userId:1 
		        },
		        columns:[
			        [  
			            {field:'id',title:'id',hidden:true,width:160},  
			            {field:'databaseType',title:'数据库类型',width:160},
			            //{field:'databaseName',title:'数据库名',width:160},
			            {field:'ip',title:'IP',width:160},
			            {field:'port',title:'端口',width:160},
			            {field:'databaseUserName',title:'用户名',width:160}
			        ]
		        ]
		    });
	})
	
	//打开 新增 编辑 对话框
   function addConfigForm(){
	    config = $("#dlgg").dialog({   
	    title: ' 新增',    
	    width: 350,    
	    height: 320,    
	    href:context+'page/addConnectionConfigPage',
	    maximizable:true,
	    modal:true,
	    buttons:[{
			text:'测试',
			iconCls:'icon-search',
			handler:function(){
	    	   testConn();
			}
		   },
	    	{
			text:'保存',
			iconCls:'icon-ok',
			handler:function(){
				var  databaseType = $('#databaseType option:selected').val();
				configUpdate2();
				//$("#mainform").submit(); 
			}
		},{
			text:'取消',
			iconCls:'icon-cancel',
			handler:function(){
					config.panel('close');
				}
		 }]
	  });
  }
	
	function configUpdate2(){
		  var  name = $('#name').val();
	      var  databaseType = $('#databaseType option:selected').val();
	      var  ip = $('#ip').val();
	      var  port = $('#port').val();
	      var  userName = $('#databaseUserName').val();
	      var  password = $('#databasePassword').val();
	      console.log("userName"+userName);
	      //var  isdefault = $('#isdefault').val();
	      var isValid = $("#mainform").form('validate');
	      if( !isValid ){
	    	   return isValid;	// 返回false终止表单提交
	      }    
		  $.ajax({
			  type:'POST',
			   	contentType:'application/json;charset=utf-8',
			           url:path+"addDatabaseConfigInfo" ,
			           data: JSON.stringify( {'name':name ,'databaseType':databaseType ,'databaseName':databaseName ,'ip':ip ,'port':port ,'databaseUserName':userName ,'databasePassword':password} ),
			           datatype: "json", 
			          //成功返回之后调用的函数             
			           success:function(data){
			              var status = data.state;
				   	       if(status == 200 ){
				   	            parent.$.messager.show({ title : "提示",msg: data.message , position: "bottomRight" });
				   	            setTimeout(function () {
				                      config.panel('close');
				                      $("#dg").datagrid('reload');
				                      window.parent.window.initDatabaseList();
				                    }, 1500);
				   	           //parent.init3();
				   	       }else{
			   	    	    parent.$.messager.show({ title : "提示",msg: data.message , position: "bottomRight" });
			   	       }
			   	     }  
	       });
	 }
	
	function delectConfig(){
		var rows = $('#dg').datagrid('getSelections');
		console.log(rows);
		if(rows.length==0){
			parent.$.messager.show({ title : "提示",msg: "请选择要删除的记录", position: "bottomRight" });
			return;
		}else{
			var connectionId=rows[0].id;
			console.log(connectionId);
			$.ajax({
				type:'post',
				url:path+"deleteDatabaseConfigInfo",
				data:{connectionId:connectionId},
				success: function(data){
					var status = data.state;
			   	       if(status == 200 ){
			   	            parent.$.messager.show({ title : "提示",msg: data.message , position: "bottomRight" });
			   	            setTimeout(function () {
			                      $("#dg").datagrid('reload');
			                      window.parent.window.initDatabaseList();
			                    }, 1500);
			   	           //parent.init3();
			   	       }else{
		   	    	    parent.$.messager.show({ title : "提示",msg: data.message , position: "bottomRight" });
		   	       }
				} 
				
			});
		}
	}
	
	
	</script>
</head>
<body>
	<div id="tb2" style="padding:5px;height:auto">
        <div>
	       	<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-table-row-insert" plain="true" id="addRowButton"  onclick="addConfigForm()"> 添加 </a>
	       		<span class="toolbar-item dialog-tool-separator"></span>
	          	       		           
	        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-table-row-delete" plain="true" id="delButton"   onclick="delectConfig()">删除</a>
	       		<span class="toolbar-item dialog-tool-separator"></span>
	        <!-- <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-standard-arrow-refresh" id="refreshButton" plain="true" onclick="refresh()">刷新</a>
	          	<span class="toolbar-item dialog-tool-separator"></span> -->
	          
	        <a href="javascript:void(0)" class="easyui-linkbutton"  plain="true"  >&nbsp;</a>
	          	<span class="toolbar-item dialog-tool-separator"></span>
	          
	        <!-- <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-ok" plain="true" id="saveRowButton"  onclick="saveRow()"> 保存 </a>
	       		<span class="toolbar-item dialog-tool-separator"></span>
	            
	       	<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-cancel" plain="true" id="cancelButton"  onclick="cancelChange()"> 取消 </a>
	       		<span class="toolbar-item dialog-tool-separator"></span> -->
	        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-tip" plain="true" title="可双击行编辑数据. &#13;钩选行进行复制."></a>
       </div> 
  	</div>
<!--  <input type="hidden" id="connectionId" th:value="${connectionId}" >
 <input type="hidden" id="databaseName" th:value="${databaseName}" >
 <input type="hidden" id="tableName"  th:value="${tableName}">
 <input type="hidden" id="objectType" th:value="${objectType}"> -->
<table id="dg"></table>
<div id="dlgg" ></div>
</body>
</html>